(function ($) {
	$.fn.carouSlide = function() {
        tileImages();
		var currentSlide = 1;
		var slider = $(this);
		var numOfSlides = $(this).children('li').length;
		
		var prev = $('a.arrow.prev');
		var next = $('a.arrow.next');
		var eleWidth;
		//var myInterval;
		
		$(prev).hide();
        var slidesToMove = 1;
		
		//--- Next button click function
		$(next).on('click',function(){
			//console.log(currentSlide);
			if(currentSlide < numOfSlides){
				$(prev).show();
				$(slider).animate({
					left:'-=' + eleWidth + 'px'
				},1000, function(){
					currentSlide += slidesToMove;
                   
					if(currentSlide == numOfSlides)
						$(next).hide();
				});
			}
		})
		
		//--- Prev button click function
		$(prev).on('click',function(){
		
			if(currentSlide > 1){
				$(next).show();
				$(slider).animate({
					left: '+=' + eleWidth + 'px'
				},1000, function(){
					currentSlide -= slidesToMove;
					if(currentSlide == 1)
					   $(prev).hide();
				});
			}
			
		})
		
		//--- Create auto animation with 'setInterval' if there no already running interval
		$.fn.carouSlide.startAnimation = function(){
			//if(myInterval == undefined || myInterval == null)
				//myInterval = window.setInterval(playSlides, 4000);
		};
		
		//--- Function to stop animation. Called with other sections are navigated
		$.fn.carouSlide.stopAnimation = function(){
			//clearInterval(myInterval);
			//myInterval = null;
			$(slider).css({
				left:'0px'
			});
			currentSlide = 1;
			$(prev).hide();
		}
		
        $.fn.carouSlide.resetItems = function(){
            eleWidth = $('.showcase.text-content').width();
            $('ul.gallery li').css({
                width: eleWidth
            })
            
            $('a.next, a.prev').css({
                height:($('a.next').width()/(83*.16))*59
            })
            
            console.log(($('a.next').width()/(83*.16))*59);
        }
        //--
        function tileImages(){
            var liMargin = 0;
            $('ul.gallery li').each(function(index){
                
               /* if((index % 2) == 0 && index !=0){
                    liMargin = 150;   
                } if((index % 4) == 0 && index !=0){
                    liMargin = 0;   
                }
                          
                $(this).css({
                    marginTop : liMargin
                })*/
               
            })
        }
        
		//--- Auto Animation
        function playSlides(){
			//console.log(currentSlide);
            if(currentSlide < numOfSlides)
			{
				$(next).click();
			}else{
				$(slider).animate({
					left:'0px'
				},1000, function(){
					currentSlide = 1;
					$(prev).hide();
					$(next).show();
				});
			}
        }
	}
}($))